<script setup lang="ts">
import { useLocalStorage } from '@/utils/useLocalStorage'
const themeOptions = defineModel<[{label: string, value: string}]>('themeOptions',{required: true, default: []})
const Theme = useLocalStorage('editor_theme', themeOptions.value.at(0)?.value || 'light')

const fontSize = useLocalStorage('editor_font_size', String(14))
</script>

<template>
    <a-select v-model:value="Theme" placeholder="Select" style="width: 150px">
        <a-select-option v-for="item in themeOptions" :key="item.value" :label="item.label"
            :value="item.value"></a-select-option>
    </a-select>
    <br />
    <a-slider v-model:value="fontSize" :min="10" :max="20" />
</template>

